// 选则分类
let form = layui.form
let id = new URLSearchParams(location.search).get('id');
console.log(id)
$.ajax({
    url:'/my/article/cates',
    success:function(res) {
        let html = template('lei',res)
        $('#fen').html(html)
        form.render('select');
        
        $.ajax({
            url: '/my/article/'+id,
            success:function (res) {
                if(res.status===0){
                    form.val('aaa',res.data)
                    initEditor()
                    $image.cropper('destroy').attr('src', 'http://ajax.frontend.itheima.net' + res.data.cover_img).cropper(options);
                }
            }
         
         })
    }
})


// 图片页面
let $image = $('#image');
let options = {
    // 宽高比例
    aspectRatio: 400 / 280,
    // 预览区容器的类名
    preview: '.img-preview',
    autoCropArea: 1
};
$image.cropper(options);

$('#btn').on('click',function () {
    $('#file').trigger('click')
})

$('#file').on('change', function () {
    let fileObj = this.files[0];
    let url = URL.createObjectURL(fileObj);
    $image.cropper('destroy').attr('src', url).cropper(options);
})

// 添加效果

$('form').on('submit',function (ev) {
    ev.preventDefault()
    let data = new FormData(this)
    data.set('content', tinyMCE.activeEditor.getContent())
    let canvas = $image.cropper('getCroppedCanvas', {
        width: 400,
        height: 280
    });
    // 把图片转成 blob 形式
    canvas.toBlob(function (blob) {
        data.append('cover_img', blob);
        data.append('Id',id)
        $.ajax({
            type: 'POST',
            url: '/my/article/edit',
            data: data,
            processData: false,
            contentType: false,
            success: function (res) {
                layer.msg(res.message);
                if (res.status === 0) {
                    location.href = '/article/list.html';
                }
            }
       
    });
})
})